import React from "react"
import Modal from 'antd/lib/modal/Modal'
import {connect} from 'umi'
import {Form,Input,Select} from "antd"
import { useEffect } from "react"
const EditForm=(props:any)=> {
    const {showEdit,isEdit}=props
    const [form]=Form.useForm()
    const {dispatch,model}=props
    const onCancel=()=>{
        dispatch({
            type: "clientInfo/save",
            payload: {
                showEdit: false,
                isEdit:false,
                showPop:false
            }
        })
    }
    
    useEffect(()=>{
        form.setFieldsValue(model)
    },[model])

    const onFinish=()=>{
        form.validateFields().then((values)=>{
            console.log('values:',values)
            if(isEdit){
                dispatch({
                    type:"clientInfo/update",
                    payload:{
                        id:model.id,
                        data:{...values}
                    }
                })
            }
            else{
                console.log('不在编辑')
                dispatch({
                    type:"clientInfo/insert",
                    payload:{
                        data:{...values}
                    }
                },function(err:any){
                    if(err) throw err
                })
            }
        })
    }
    return (
    <Modal visible={showEdit} getContainer={false} title="编辑" onCancel={onCancel} onOk={onFinish}>
        <Form form={form} onFinish={onFinish}>
            <Form.Item label="姓名" name="fullname" rules={[{required:true,message:"请输入姓名"}]}>    
                <Input placeholder="请输入姓名"/>  
            </Form.Item>
            <Form.Item label="身份证号" name="idno" rules={[{required:true,message:"请输入身份证号"}]}> 
                <Input placeholder="请输入身份证号"/>
            </Form.Item>
            <Form.Item label="联系电话" name="telephone" rules={[{required:true,message:"请输入联系电话"}]}> 
                <Input placeholder="请输入联系电话"/>
            </Form.Item>
        </Form>

    </Modal>
    )
}
const mapStateToProps=(state:any)=>({
    model:state.clientInfo.current,
    showEdit:state.clientInfo.showEdit,
    isEdit:state.clientInfo.isEdit
})
export default connect(mapStateToProps)(EditForm)
